import React, { Component } from 'react'
import {Button, Select} from 'antd'
// import {createAddAction, createMinusAction, createAddActionAsync} from '../../redux/count_action'
// 获取redux保存的状态
import store from '../../redux/store'
export default class CountUI extends Component {
  // state = {count: 0, selectValue: 1}
  state = {selectValue: 1}
  // componentDidMount() {
  //   // 检测redux变化，只要变化就调用render
  //   // redux状态改变 回调执行
  //   // 可以移到index.js中
  //   store.subscribe(() => {
  //     this.setState({})
  //   })
  // }
  add = () => {
    // 纯react
    // let {count, selectValue} = this.state
    // this.setState({count: parseInt(selectValue)+count})

    let {selectValue} = this.state
    // redux
    // store.dispatch(createAddAction(selectValue*1))

    // 使用react-redux
    this.props.add(selectValue*1)
  }
  minus = () => {
    // let {count, selectValue} = this.state
    // this.setState({count: count-parseInt(selectValue)})

    let {selectValue} = this.state
    // redux
    // store.dispatch(createMinusAction(selectValue*1))

    // react-redux
    this.props.minus(selectValue*1)
  }
  addIffOdd = () => {
    let {selectValue} = this.state
    if (store.getState() % 2 !== 0) {
      // redux
      // store.dispatch(createAddAction(selectValue*1))

      // react-redux
      this.props.add(selectValue*1)
    }
  }
  addAsync = () => {
    let {selectValue} = this.state
    // store.dispatch(createAddActionAsync(selectValue*1, 1000))
    this.props.addAsync(selectValue*1, 1000)
  }
  render() {
    console.log(this.props);
    return (
      <div>
        {/* <h1>当前求和：{this.state.count}</h1> */}
        {/* <h1>当前求和：{store.getState()}</h1> */}
        <h1>当前求和：{this.props.count}</h1>

        <Select defaultValue="1" onChange={(value) => {this.setState({selectValue:value})}}>
          <Select.Option value="1">1</Select.Option>
          <Select.Option value="2">2</Select.Option>
          <Select.Option value="3">3</Select.Option>
        </Select>
        <Button onClick={this.add}>+</Button>
        <Button onClick={this.minus}>-</Button>
        <Button onClick={this.addIffOdd}>当前求和为奇数再加</Button>
        <Button onClick={this.addAsync}>异步加</Button>

      </div>
    )
  }
}
